

{{table | json_encode}}	


<p>path {{table.options.url}}</p>
<p>class {{table.class  }}</p>	


<style>
	#genTable-{{table.class}} {
		{%if table.options.width %}	
			width: {{table.options.width}};
		{%endif%}
	}
</style>

<table id='genTable-{{table.class}}'>
	<caption> {{table.name}} </caption>	
	<thead>
		<tr>
			<th></th>
		{% for th in table.head %}
			<th class="genTable-th-{{th.name}}" style="{{th.size}};, text-align:{{th.align}};"> {{th.display}} </th>
		{% endfor %}
		</tr>			
	</thead>
	<tbody data-bind="">
		<tr>
			<td style="width:100px;" >
				<button data-bind="" >V</button>
				<button data-bind="">C</button>
			</td>
			{% for td in table.head %}
				    <td class="genTable-th-{{td.name}}" style="{{td.size}}; text-align:{{td.align}};"> 
					{% if td.edit %}
							<span  data-bind="">  </span>	
						{% if td.type == "int" %}
							<input type="text" style="width:90%" , data-bind="" value=''> 
						{% elseif td.type == "string" %}
							<input type="text" style="width:90%" data-bind="" value=''> 
						{% elseif td.type == "text" %}
							<textarea name=""  style="width:90%" id="" data-bind="" rows="2"> </textarea> 
						{% elseif td.type == "select" %}

						{% elseif td.type == "check" %}

						{% elseif td.type == "radio" %}

						{% elseif td.type == "date" %}

						{% endif%}	
					{% else %}	
						<span  data-bind="" >  </span> 
					{% endif %}

				</td>
			{% endfor %}
		</tr>
		<!-- ko foreach: genTable.{{table.class}}().rows()  -->
		<tr>
			<td style="width:100px;" >
				<button data-bind="click:events.save" >V</button>
				<button data-bind="click:events.edit">...</button>
				<button data-bind="click:events.cancel">C</button>
				<button data-bind="click:events.remove">R</button>
			</td>
			{% for td in table.head %}
				    <td class="genTable-th-{{td.name}}" style="{{td.size}}; text-align:{{td.align}};"> 
					{% if td.edit %}
						<!-- ko ifnot:state.edit  --> 		<span  data-bind="text:cells().{{td.name}}">  </span>		<!-- /ko -->
						{% if td.type == "int" %}
						<!-- ko if:state.edit  --> 		<input type="text" style="width:90%" , data-bind="value:cells_edit().{{td.name}}" value=''> <!-- /ko -->
						{% elseif td.type == "string" %}
							<!-- ko if:state.edit  --> 		<input type="text" style="width:90%" data-bind="value:cells_edit().{{td.name}}" value=''> <!-- /ko -->
						{% elseif td.type == "text" %}
							<!-- ko if:state.edit  --> 		<textarea name=""  style="width:90%" id="" data-bind="value:cells_edit().{{td.name}}" rows="2"> </textarea> <!-- /ko -->
						{% elseif td.type == "select" %}

						{% elseif td.type == "check" %}

						{% elseif td.type == "radio" %}

						{% elseif td.type == "date" %}

						{% endif%}	
					{% else %}	
						<!-- ko ifnot:state.edit  --> 	<span  data-bind="text:cells().{{td.name}}">  </span> <!-- /ko -->
					{% endif %}

				</td>
			{% endfor %}
		</tr>
		<!-- /ko -->
	</tbody>
</table>
	
<script> 

	var table_classes = table_classes ||  [];
	table_classes['{{table.class}}'] =  {
		head: {{table.headjs | raw }},
		rows: {{table.rowsjs | raw }},		
		options: {{table.optionsjs | raw }}
	};



</script>